<template>
	<view>
		<view class="infoBox">
			<text class="headPhoto">头像</text>
			<image @click="changeHead" class="photoImg" :src="userinfo.member_avatar"></image>
		</view>
		<view class="infoBoxa">
			<text class="headPhoto">昵称</text>
			<input class="inputname" v-model="userinfo.member_name" type="text" placeholder="请输入新的昵称" />
			<image class="rightimg" src="../../static/user2/rightjt.png"></image>
		</view>
		<view class="infoBox">
			<text class="headPhoto">账号</text>
			<text class="infoCon">{{userinfo.member_mobile}}</text>
		</view>
		<view class="infoBox">
			<text class="headPhoto">邀请码</text>
			<text class="infoCon">{{userinfo.inviter_num}}</text>
		</view>
		<view class="infoBoxa">
			<text class="headPhoto">地址</text>
			<pick-regions :defaultRegion="defaultRegionCode" @getRegion="handleGetRegion">
				<view class="adressBox">
					<text class="adress">{{userinfo.address}}</text>
				</view>
			</pick-regions>
		</view>
	</view>
</template>

<script>
	import Require from '@/common/require.js';
	import pickRegions from '@/components/pick-regions/pick-regions.vue'
	export default {
		components: {
			pickRegions
		},
		data() {
			return {
				defaultRegion: ['安徽省', '合肥市', '蜀山区'],
				defaultRegionCode: '440113',
				region: [],
				// photo: '',
				// adress: '选择地址',
				name: '',
				userinfo: '',
			};
		},
		onShow() {
			var self = this
			self.userinfo = uni.getStorageSync('userinfo');
			// console.log(self.userinfo)
		},
		computed: {},
		methods: {
			changeHead: function() {
				var self = this
				uni.chooseImage({
					count: 1,
					sizeType: ['copressed'],
					success(res) {
						uni.showLoading({
							title: '上传中'
						});
						//因为有一张图片， 输出下标[0]， 直接输出地址
						var imgFiles = res.tempFilePaths[0]
						// console.log(res1)
						// 上传图片
						// 做成一个上传对象
						var uper = uni.uploadFile({
							// 需要上传的地址
							url: 'http://xjk.minshangkeji.com/index.php/api/upload/single',
							// filePath  需要上传的文件
							filePath: imgFiles,
							name: 'file',
							success(uploadFileRes) {
								var data = JSON.parse(uploadFileRes.data);
								self.userinfo.member_avatar = data.data.filename
								uni.hideLoading();
								console.log(uploadFileRes)
								// 显示上传信息
							}
						});
						// onProgressUpdate 上传对象更新的方法
						uper.onProgressUpdate(function(res) {
							// 进度条等于 上传到的进度
							self.percent = res.progress
						})
					}
				})
			},
			handleGetRegion(region) {
				var self=this
				self.region = region;
				self.userinfo.address = region[0].name + ' ' + region[1].name + ' ' + region[2].name;
			},
			onNavigationBarButtonTap() {
				var self=this;
				Require.commonRequest({
					url: '/api/member/setprofile',
					method:'POST',
					data:{
						member_avatar:self.userinfo.member_avatar,
						member_name:self.userinfo.member_name,
						member_province_id:self.region[0].name,
						member_city_id:self.region[1].name,
						member_district_id:self.region[2].name
					},
					success: function(ret) {
						// console.log(ret.data)
						if (ret.data.code == 400){
							let _userInfo=uni.getStorageSync('userinfo');
							 _userInfo=self.userinfo
							 uni.setStorageSync('userinfo',_userInfo)
							uni.redirectTo({
								url:'./personalInformation'
							})
						}
					},
					fail: function() {
						uni.showToast({
							icon: "none",
							title: "网络异常，请稍后再试"
						})
					}
				})
				}
		}
	}
</script>

<style lang="scss">
	.infoBox {
		width: 680rpx;
		height: 120rpx;
		border-bottom: 1rpx solid #E5E5E5;
		position: relative;
		top: 20rpx;
		margin-left: 35rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.headPhoto {
		font-size: 30rpx;
		font-family: PingFang SC;
		font-weight: 400;
		color: rgba(51, 51, 51, 1);
	}

	.adress {
		font-size: 30rpx;
		font-family: PingFang SC;
		font-weight: 400;
		color: rgba(51, 51, 51, 1);
	}

	.photoImg {
		width: 80rpx;
		height: 80rpx;
		border-radius: 50%;
	}

	.infoCon {
		font-size: 28rpx;
		font-family: PingFang SC;
		font-weight: 400;
		color: rgba(46, 46, 46, 1);
	}

	.infoBoxa {
		width: 680rpx;
		height: 120rpx;
		border-bottom: 1rpx solid #E5E5E5;
		position: relative;
		top: 20rpx;
		margin-left: 35rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.inputname {
		font-size: 30rpx;
		width: 550rpx;
		height: 100%;
		padding-left: 40rpx;
		text-align: right;
	}

	.rightimg {
		width: 14rpx;
		height: 22rpx;
		float: right;
	}

	.adressBox {
		width: 560rpx;
		height: 115rpx;
		display: flex;
		align-items: center;
		flex-wrap: wrap;
	}
</style>
